import React, { Component } from "react";
import { TabBar } from "antd-mobile";
import { withRouter } from "react-router-dom";

@withRouter
class NavLinkBar extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }
  render() {
    const { pathname } = this.props.location;
    const { data } = this.props;
    console.log(data);
    console.log(pathname);
    const Item = TabBar.Item;
    return (
      <TabBar
      tintColor="#666"
      >
        {data.map(v => (
          <Item 
            key={v.path}
            title={v.text}
            icon={{uri:require(`../../assets/imgs/${v.icon}.png`)}}
            selectedIcon={{uri:require(`../../assets/imgs/${v.icon}-active.png`)}}
            selected={pathname ===v.path}
            onPress={()=>{
              this.props.history.push(v.path)
            }}
          />
        ))}
      </TabBar>
    );
  }
}
export default NavLinkBar;
